<template>
  <a-layout class="layout">
    <!-- 导航栏 -->
    <a-layout-header class="layout-header">
      <Nav />
    </a-layout-header>

    <!-- 内容区 -->
    <a-layout-content>
      <div class="main-content">
        <router-view></router-view>
      </div>

      <BackToTop />
    </a-layout-content>

    <!-- 底部 -->
    <a-layout-footer>
      <Footer />
    </a-layout-footer>
  </a-layout>
</template>

<script setup lang="ts">
import Nav from './components/navigation/index.vue'
import Footer from './components/footer/index.vue'
import BackToTop from './components/backToTop/index.vue'
</script>

<style scoped>
.layout {
  min-height: 100vh;
  background: #fff;
}

.layout-header {
  background: #fff;
  padding: 0;
  height: 64px;
  line-height: 64px;
}

.main-content {
  padding: 24px;
  min-height: 280px;
  max-width: 1200px;
  margin: 0 auto;
}
</style>
